<script setup lang="ts">
// 获取屏幕边界到安全区域距离

const { safeAreaInsets } = uni.getSystemInfoSync()
defineProps<{
  title: string
}>()
</script>

<template>
  <view class="navbar" :style="{ paddingTop: safeAreaInsets?.top + 'px' }">
    <view class="navbar">
      <!-- logo文字 -->
      <view class="logo">
        <text class="logo-text">{{ title ? title : "登录" }}</text>
      </view>
    </view>
  </view>
</template>

<style lang="scss" scoped>
/* 自定义导航条 */
.navbar {
  background-image: linear-gradient(90deg, #FA3A34, #FB9360);
  background-size: cover;
  position: relative;
  display: flex;
  flex-direction: column;

  .logo {
    text-align: center;
    height: 88rpx;
    padding-top: 16rpx;

    .logo-text {
      line-height: 28rpx;
      color: #fff;
      font-size: 36rpx;
    }
  }
}
</style>
